<!DOCTYPE html>
<!-- saved from url=(0060)http://fantaghiro.github.io/miaov/JS_Basic_Lessons/10-1.html -->
<html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta charset="UTF-8">
	<title>时间扩展版</title>
	<style>
		#div2 {
			margin: 50px auto;
			font-size: 0;
			text-align: center;
		}
		#div2 img{
			width: 50px;
			margin: 0;
			padding: 0;
		}
	</style>
	<script src="./时间扩展版_files/miaov.js"></script>
	<script>
		window.onload = function(){
			var oDiv1 = document.getElementById('div1'),
				oDiv2 = document.getElementById('div2'),
				aImg = oDiv2.getElementsByTagName('img'),
				arrImg = ['10-img/0.JPG', '10-img/1.JPG', '10-img/2.JPG', '10-img/3.JPG', '10-img/4.JPG', '10-img/5.JPG', '10-img/6.JPG', '10-img/7.JPG', '10-img/8.JPG', '10-img/9.JPG', '10-img/colon.JPG'];

			function fnTime(){
				
				var myTime = new Date(),
					iYear = myTime.getFullYear(),
					iMonth = myTime.getMonth() + 1, //一月份是从0开始算的
					iDate = myTime.getDate(),
					iDay = myTime.getDay(),
					iHours = myTime.getHours(),
					iMinutes = myTime.getMinutes(),
					iSeconds = myTime.getSeconds(),
					str = '',
					str2 = '';

				if(iDay === 0) iDay = '星期日'; 
				if(iDay === 1) iDay = '星期一';  
				if(iDay === 2) iDay = '星期二'; 
				if(iDay === 3) iDay = '星期三'; 
				if(iDay === 4) iDay = '星期四'; 
				if(iDay === 5) iDay = '星期五'; 
				if(iDay === 6) iDay = '星期六';

				str = iYear + '年' + iMonth + '月' + iDate + '日 ' +  iDay + ' ' + toTwo(iHours) + ' : ' + toTwo(iMinutes) + ' : ' + toTwo(iSeconds);
				str2 = toTwo(iHours) + toTwo(iMinutes) + toTwo(iSeconds);
				//文字时间
				oDiv1.innerHTML = str;

				//没有动画效果的图片时间
				aImg[0].src = arrImg[str2.charAt(0)];
				aImg[1].src = arrImg[str2.charAt(1)];
				aImg[3].src = arrImg[str2.charAt(2)];
				aImg[4].src = arrImg[str2.charAt(3)];
				aImg[6].src = arrImg[str2.charAt(4)];
				aImg[7].src = arrImg[str2.charAt(5)];
	
			}

			function toTwo(n){
				return n < 10 ? '0' + n : '' + n;
			}

			fnTime();
			setInterval(fnTime, 1000);
			
		}
	</script>
</head>
<body>
	<div id="div1">2016年6月18日 星期六 19 : 49 : 15</div>
	<div id="div2">
		<img src="./时间扩展版_files/1.JPG" alt="">
		<img src="./时间扩展版_files/9.JPG" alt="">
		<img src="./时间扩展版_files/colon.JPG" alt="">
		<img src="./时间扩展版_files/4.JPG" alt="">
		<img src="./时间扩展版_files/9.JPG" alt="">
		<img src="./时间扩展版_files/colon.JPG" alt="">
		<img src="./时间扩展版_files/1.JPG" alt="">
		<img src="./时间扩展版_files/5.JPG" alt="">
	</div>

<div id="__nightingale_view_cover" style="width: 100%; height: 100%; transition: -webkit-transform 10s ease-in-out; position: fixed !important; left: 0px !important; bottom: 0px !important; overflow: hidden !important; pointer-events: none !important; z-index: 2147483647; opacity: 0; background: rgb(0, 0, 0) !important;"></div></body></html>